class Details {
    constructor() {
        this.pic = document.querySelector('.pic>img')
        this.details = document.querySelector('.details')
        this.price = document.querySelector('.price')
        this.title = document.querySelector('.title')
        this.enlarge = document.querySelector('.enlarge img')
        this.span = document.querySelector(".bottom span")
        this.init()
    }
    init() {
        this.request()
    }
    getQueryStr(name) {
        //location.search这个属性可以直接帮助咱们拿到查询字符串需要的部分数据
        let id = location.search.slice(1)
        let obj = {}
        let arr = id.split('=')
        obj[arr[0]] = arr[1]
        return obj[name]
    }
    request() {
        //判断有没有id存在
        let myId = this.getQueryStr('id')
        if (!myId) {
            location.href = '../index.html'
            return false
        } else {
            getAjax({
                    url: '../libs/goods.json'
                })
                .then(data => {
                    let res = JSON.parse(data)
                    res = res.slice(0, 100)
                    console.log(res)
                    let goods = res.find(item => {
                        return item.goods_id == myId
                    })
                    this.render(goods)
                })
        }
    }
    render(data) {
        this.pic.src = data.img_big_logo
        this.details.innerHTML = data.goods_introduce
        this.title.innerHTML = data.title
        this.price.innerHTML = data.price
        this.enlarge.src = data.img_big_logo
        this.jisuan()
    }
    jisuan() {
        let list = JSON.parse(localStorage.getItem("cart")) || []
        let num = 0
        if (list.length) {
            list.forEach(item => {
                num += item.cart_number
            })
            this.span.innerHTML = num
        }
    }
}

require(['./config'], () => {
    require(['aj'], () => {
        new Details()
    })
})

require(['./config'], () => {
    require(['myCookie'], () => {
        // 顶部登录名字
        let user = document.querySelector(".user")

        function inital() {
            if (getCookie("userName")) {
                user.innerHTML = getCookie("userName")
                // span.innerHTML = getCookie("userName")
            }
        }
        inital()
        //猜你喜欢
    })
})

class Glass {
    constructor(ele1, ele2, ele3) {
        this.wrap = this.getEle(ele1)
        this.span = this.getEle(ele2)
        this.pic = this.getEle(ele3)

        console.log(this.wrap, this.span, this.pic)
        this.inital()
    }
    inital() {
        this.move()

    }
    getEle(ele) {
        return document.querySelector(ele)
    }
    //小盒子跟着移动方法
    move() {
        this.wrap.onmousemove = (e) => {
            let l = e.clientX - this.span.offsetWidth / 2 - this.wrap.parentElement.offsetLeft
            let h = e.clientY - this.span.offsetHeight / 2 - this.wrap.parentElement.offsetTop
            if (l <= 0) {
                l = 0
            } else if (l >= this.wrap.offsetWidth - this.span.offsetWidth) {
                l = this.wrap.offsetWidth - this.span.offsetWidth
            }
            if (h <= 0) {
                h = 0
            } else if (h >= this.wrap.offsetHeight - this.span.offsetHeight) {
                h = this.wrap.offsetHeight - this.span.offsetHeight
            }
            this.span.style.left = l + "px"
            this.span.style.top = h + "px"
            // console.log(this.span.style.left, this.span.style.top)
            this.picMove(l, h)
        }
    }

    //enlarge盒子图片移动
    picMove(l, h) {
        let x = l / (this.wrap.offsetWidth - this.span.offsetWidth)
        let y = h / (this.wrap.offsetHeight - this.span.offsetHeight)
        this.pic.style.left = -x * (this.pic.parentElement.offsetWidth - this.pic.offsetWidth) + "px"
        this.pic.style.top = y * (this.pic.parentElement.offsetHeight - this.pic.offsetHeight) + "px"
        // console.log(this.pic.style.left, this.pic.style.top)
    }
}

new Glass(".zoom .pic", ".pic span", ".enlarge div")

class BackTop {
    constructor() {
        this.btn = document.querySelector(".backTop .icon")
        this.init()
    }
    init() {
        this.click()
    }
    click() {

        this.btn.onclick = () => {
            document.documentElement.scrollTop = 0
        }
    }
}
new BackTop()